<template>
	<view class="rewardDescription">
		<view class="title">
			推达人进阶奖励
		</view>
		<view class="desc">

			先拿裂变奖励26888元，后期佣金躺赚
		</view>
		<view class="ul">
			<view class="li" v-for="item in list">
				<view class="left">
					<image class="icon" :src="item.icon" mode="widthFix">
					</image>
					<view class="cont">
						<view class="name">
							{{item.name}}
						</view>
					
						<view class="percentBox">
							<u-line-progress height='6' :show-percent="false" inactive-color="#743DE7"
								active-color="#FFFFFF" :percent="item.percent"></u-line-progress>
							<view class="percent">
								{{item.percent}}%
							</view>
						</view>
					</view> 
				</view>
				<view class="right">
					{{item.money}}元
				</view>
			</view>
		</view>
	
	
	
	
	<view class="title">
		注意事项
	</view>
	<view class="desc">
		凡是存在以下违规行为的用户，无忧赚有权扣除其作弊奖励，行为严重者将做封号处理，请您正常使用平台赚钱。<br /><br />
		
		同一终端设备注册，绑定同一支付宝账号均视为同一账户，无法获得奖励。<br /><br />
		
		通过不正当手段（包括但不限于侵犯第三人合法权益、作弊、扰乱系统、实施网络攻击、批量注册、用模拟器注册、以及各种形式诱导收徒）无忧赚有权终结追回奖励，必要时追究法律责任。<br /><br />
		
		提现奖励仅限用户余额提现，所有收益均发放到用户余额。

	</view>
	<view class="tips">
		有效好友：托管收益满一元即为有效好友
	</view>
	
	</view>
</template>

<script>
	export default{
		data(){
			return{
				list:[{
					name:'一级有效好友100人',
					icon:'https://wuyouzhuanapp.oss-cn-beijing.aliyuncs.com/61.png',
					percent:25,
					money:100.00
				},{
					name:'一级有效好友100人',
					icon:'https://wuyouzhuanapp.oss-cn-beijing.aliyuncs.com/57.png',
					percent:0,
					money:200.00
				},{
					name:'一级有效好友100人',
					icon:'https://wuyouzhuanapp.oss-cn-beijing.aliyuncs.com/58.png',
					percent:0,
					money:200.00
				},{
					name:'一级有效好友100人',
					icon:'https://wuyouzhuanapp.oss-cn-beijing.aliyuncs.com/59.png',
					percent:0,
					money:200.00
				},{
					name:'一级有效好友100人',
					icon:'https://wuyouzhuanapp.oss-cn-beijing.aliyuncs.com/60.png',
					percent:0,
					money:200.00
				}]
			}
		}
	}
</script>

<style scoped lang="scss">
	.rewardDescription {
		padding: 41rpx;
		.tips{
			font-size: 30rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFD466;
			line-height: 44rpx;
			text-align: center;
		}

		.ul {
			.li {
				margin-bottom: 32rpx;
				display: flex;
				justify-content: space-between;
				.right{
					font-size: 28rpx;
					font-family: PingFang SC-Semibold, PingFang SC;
					font-weight: 600;
					color: #FFD466;
					line-height: 41rpx;
				}
				.left{
					flex: 1;
					display: flex;
					.cont{
						flex: 1;
					}
					.name{
						font-size: 28rpx;
						font-family: PingFang SC-Medium, PingFang SC;
						font-weight: 500;
						color: #FFD466;
						line-height: 41rpx;
						margin-bottom:10rpx;
					}
					.percentBox{
						max-width: 280rpx;
						display: flex;
						align-items: center;
						.percent{
							font-size: 24rpx;
							font-family: PingFang SC-Regular, PingFang SC;
							font-weight: 400;
							color: #FFFFFF;
							line-height: 35rpx;
							margin-left: 20rpx;
						}
					}
				}
				.icon {
					width: 35rpx;
					height: 52rpx;
					margin-right: 32rpx;
				}
			}
		}

		.title {
			background: #400FA6;
			border-radius: 58rpx 58rpx 58rpx 58rpx;
			padding: 3px 15px;
			display: inline-flex;
			font-size: 32rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #C7ACFF;

		}

		.desc {
			font-size: 28rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			line-height: 41rpx;
			padding: 20rpx 0;
		}
	}
</style>
